<template>
    <div class="content-box">
      <placeholder v-if="!race_rule.constitution" text="先创建赛事的章程吧"></placeholder>
      <div v-else v-html="race_rule.constitution" class="rule-des editor-html-content"></div>
      <div class="button-box" v-if="!loading">
        <router-link :to="{path:'/race/detail/rule/edit?id='+$route.query.id+'&matchtype='+$route.query.matchtype+'&tasktype='+$route.query.tasktype+'&isRun='+$route.query.isRun}">
            <el-button type="primary">{{!race_rule.constitution?'创建赛事章程':'编辑赛事章程'}}</el-button>
        </router-link>
      </div>
  </div>
</template>

<script>
  import {mapGetters} from 'vuex'
  export default {
    props: {},
    computed: {
      ...mapGetters({
        loading: 'loading',
        race_rule: 'race_rule'  // 获取赛事章程
      })
    },
    mounted () {
      this.$store.dispatch('race_rule', {matchId: this.$route.query.id})
    }
  }
</script>

<style scoped lang='scss'>
.rule-des {
  margin-bottom: 20px;
  line-height: 30px;
}

.button-box {
  margin: 30px auto;
}
</style>
